<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no" />
  <meta name="description" content="{{ site.description }}" />

  {% capture social_title %}
    {% if page.title %}
      {{ page.title }} | {{ site.title }}
    {% else %}
      {{ site.title }}
    {% endif %}
  {% endcapture %}
  <!-- OpenGraph -->
  <meta property="og:title" content="{{ social_title | strip }}" />
  <meta property="og:type" content="website" />
  <meta property="og:description" content="{{ site.tagline }}" />
  <meta property="og:url" content="{{ page.url | absolute_url }}" />
  <!-- query param at the end is for cache busting if/when more dynamic social images are added -->
  <meta property="og:image" content="{{ '/images/social.jpg' | absolute_url }}?t={{ site.time | date: "%Y-%m-%d-%H-%M" }}" />
  <!-- Twitter -->
  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:site" content="@{{ site.twitter_username }}">
  <meta name="twitter:creator" content="@{{ site.twitter_username }}">

  {% capture page_title %}
    {% if page.title %}
      {{ page.title }} | {{ site.title }}
    {% else %}
      {{ site.title }} - {{ site.tagline }}
    {% endif %}
  {% endcapture %}
  <title>{{ page_title | strip }}</title>

  <link rel="canonical" href="{{ page.url | absolute_url }}" />

  <link rel="stylesheet" href="{{ '/styles/normalize.css' | relative_url }}" />
  <link rel="stylesheet" href="{{ '/styles/index.css' | relative_url }}" />
  <link rel="stylesheet" href="{{ '/styles/lite-youtube-embed.css' | relative_url }}" />
  <link rel="icon" href="{{ '/favicon.ico' | relative_url }}" type="image/x-icon" />
  <link rel="alternate" href="{{ '/news/atom/' | relative_url }}" type="application/atom+xml" title="OpenRA - News Feed" />
  <!-- hack to prevent Firefox from doing a "FOUC" -->
  <!-- the contents of the <script> aren't important, just that it is here -->
  <script>var PREVENT_FOUC = true;</script>
</head>

